<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="<%=basePath%>static/css/jquery-ui.min.css" />
<link href="<%=basePath%>static/css/common_css.css" rel="stylesheet" />
<link href="<%=basePath%>static/css/center.css" rel="stylesheet" />
<script type="text/javascript"
	src="<%=basePath%>static/js/jquery-1.11.1.min.js"></script>
<title>已完成订单</title>
<script type="text/javascript">
function payOrder(orderId){
	var orderPrice = $("#orderPrice").val();
	$.ajax({
		url:"<%=basePath%>users/checkAccountNo",
		type:"post",
		data:{totalPrice:orderPrice},
		success:function(result){
			if(result) {
				$.ajax({
					url:"<%=basePath%>order/payOrder?orderId="+orderId,
					type:"post",
					success:function(data) {
						if(data) {
							alert("付款成功");
							$("#payDiv").css("display","none");
							$("label[name=payFlag]").text("已支付");
						} else {
							alert("付款失败");
						}
					}
				});
			} else {
				alert("余额不足，请先充值");
			}
		}
	});
}

function cancelOrder(orderId) {
	if(confirm("是否需要取消该笔订单？")) {
		$.ajax({
			url:"<%=basePath%>order/cancelOrder",
			type:"post",
			data:{orderId:orderId},
			success:function(data){
				if(data){
					alert("订单取消成功");
					window.location.href="<%=basePath%>order/nonComOrder";
				} else {
					alert("取消失败");
				}
			}
		});
	}
}
</script>
</head>
<body>
<h2 style="text-align: center; font-family: 楷体;">未付款订单管理</h2>
<br>	
	<c:choose>
		<c:when test="${orderHeader==null || orderHeader==''}">
			<!-- 未查询出数据开始   -->
			<div class="no-ticket-w" id="noticketlistid" >
				<div class="no-ticket">
					<span class="i-no"></span>
					<p>
						您没有未完成订单，可以通过<br clear="none"> <a href="<%=basePath %>order/searchTickets" target="_blank"
							id="tain_code_yuding" shape="rect">车票预订</a> 功能，来制定出行计划。
					</p>
				</div>
			</div>
			<!-- 未查询出数据 结束  -->
		</c:when>
		<c:otherwise>
			<div class="order-item" id="orderinfobodyTable" style="display: block;">
				<div class="order-item-hd">
					<div class="time">
						订单日期：<strong><fmt:formatDate value="${orderHeader.orderDate }" pattern="yyyy-MM-dd"/> </strong>
					</div>
					<div class="per-s"></div>
					<div class="place" style="width: 290px">
						<strong>${orderHeader.ticket.startStation }</strong><b class="dc"></b><strong>${orderHeader.ticket.endStation }</strong>
					</div>
					<div class="time2">
						乘车日期：<strong><fmt:formatDate value="${orderHeader.startTime }" pattern="yyyy-MM-dd HH:mm:ss"/> </strong>
					</div>
				</div>
				<div class="order-item-bd">
					<table class="table-c" id="orderTableItem">
						<tbody>
							<tr>
								<th width="10%">序号</th>
								<th width="25%">车次信息</th>
								<th width="25%">旅客信息</th>
								<th width="20%">票款金额</th>
								<th width="20%">车票状态</th>
								</tr>
							<c:forEach items="${orderHeader.orderDetail }" var="detail" varStatus="index">
							<tr>
								<td><label>${index.count }</label></td>
								<td><div class="ccxx">
									<fmt:formatDate value="${orderHeader.startTime }" pattern="yyyy-MM-dd HH:mm:ss"/> 开<br>
									${orderHeader.ticket.ticketNo } ${orderHeader.ticket.startStation }-${orderHeader.ticket.endStation }
									</div>
								</td>
								<td>${detail.passenger.passengerName }<br>
									${detail.passenger.cardNo }
								</td>
								<td><span class="colorA">${detail.orderPrice }元</span></td>
								<td><label  name="payFlag">待支付</label></td>
							</tr>
							</c:forEach>
						</tbody>
					</table>
				<div class="t-foot">
					<span>总张数：<strong>${orderHeader.orderDetail.size() }</strong></span> 
					<span><label name="payFlag">待支付</label>金额：<strong
								class="colorA">${orderHeader.orderPrice }元</strong>
					</span>
					<input type="hidden" id="orderPrice" value="${orderHeader.orderPrice }">
				</div>
				<div class="t-btn" id="payDiv">
					<div class="btn">
						<a href="#nogo" id="continuePayNoMyComplete"
								onclick="payOrder('${orderHeader.orderId}')"
									class="btn92s">继续支付</a>
					</div>
					<div class="btn">
						<a href="#nogo"
								onclick="cancelOrder('${orderHeader.orderId}')"
									id="cancel_button_pay" class="btn92">取消订单</a>
					</div>
				</div>
			</div>
		</div>
		</c:otherwise>
	</c:choose>	
</body>
</html>